<template>
	<gui-page ref="guiPage" :customHeader="true">
		<!-- 导航 -->
		<template v-slot:gHeader>
			<nav-bar-custom left-icon="left" :title="$t('taskManagement.changDestination')"
				@clickLeftBack="clickLeftBack" scanType="0"></nav-bar-custom>
		</template>

		<template v-slot:gBody>
			<view class="page-auto-noheight paddingbottom">
				<!-- 调拨单信息 -->
				<view class="custom-form-card" style="margin:10rpx">
					<view class="custom-card-title">
						<text class="title-line"></text>
						{{ $t('taskManagement.taskDetailsInfor') }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.taskNo')
							}}：</text>{{ data.inforDetails.taskCode }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.taskType')
							}}：</text>{{ data.inforDetails.businessTaskTypeName }}
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('mexico.scanType')
								}}：</text>{{ data.inforDetails.scanType }}
						</view>
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.agvNo')
								}}：</text>{{ data.inforDetails.robotCode }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.palletNo')
								}}：</text>{{ data.inforDetails.cartonNo }}
						</view>
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.palletType')
								}}：</text>{{ data.inforDetails.cartonType }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.transportedQty')
								}}：</text>{{ data.inforDetails.qty }}
						</view>
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.priority')
								}}：</text>{{ data.inforDetails.initPriority }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.pick-upLocation')
							}}：</text>{{ data.inforDetails.fromLocationName }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.unloadingPosition')
							}}：</text>{{ data.inforDetails.toLocationName }}
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('taskManagement.unloadingPositionQty')
								}}：</text>{{ data.inforDetails.existQty }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('distributedEnter.materialCode')
							}}：</text>{{ data.inforDetails.materialCode }}
					</view>
					<view class="custom-card-itemOne">
						<view class="card-item-50">
							<text class="item-info-title">{{ $t('distributedEnter.materialName')
								}}：</text>{{ data.inforDetails.materialName }}
						</view>
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('finishedInventory.creationTime')
							}}：</text>{{ data.inforDetails.createTime }}
					</view>
					<view class="custom-card-itemOne">
						<text class="item-info-title">{{ $t('taskManagement.completionTime')
							}}：</text>{{ data.inforDetails.taskCompleteTime }}
					</view>
				</view>
				<view class="gui-flex gui-rows gui-nowrap gui-align-items-center gui-margin-top"
					style="margin-top:15rpx">
					<view class="gui-title-line"></view>
					<text class="gui-primary-text gui-h6" style="padding-left:50rpx; padding-right:50rpx;">{{
						$t('taskManagement.taskDetailsInfor') }}</text>
					<view class="gui-title-line"></view>
				</view>
				<uni-card class="element-auto gui-margin-top card-my">
					<view class="element-auto" style="height: 300rpx">
						<zb-table :columns="data.column1" :stripe="true" @rowClick="rowClick" :border="true"
							:data="tableData.list" @customLook="customBtnFn" :cell-style="cellStyle"
							:cell-header-style="cellHeaderStyle">
						</zb-table>
					</view>
				</uni-card>
				<!-- 底部操作栏 -->
				<view class="page-bottom-box bottom-postion">
					<view class="page-bottomBtn bottomBtn-bgcolor-green" @click="changDestination">
						{{ $t('taskManagement.changDestination') }}
					</view>
				</view>
				<!-- 表格彈框 -->
				<uni-popup ref="popup" type="center">
					<view class="input-dialog-box"
						style="padding: 40rpx 20rpx 200rpx 20rpx;border-radius: 22rpx;width: 600rpx;">
						<uni-icons class="popup-close-icons" type="closeempty" color="#9C9C9C" size="26"
							@click="closePopup"></uni-icons>
						<view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title"
								style="width:100rpx">{{ $t('translationImage.process') }}：</text>
							<view class="input-dialog-item-count" style="width:100%;position: relative;"
								v-if="data.indexs > 0">
								<!-- <uni-easyinput class="input-border" v-model="data.popupInfo.processCode"
									:placeholder="$t('distributedEnter.damageQty')" /> -->
								<comboGrid ref="comboGridRef" v-model="data.popupInfo.processCode"
									:requestParam="data.requestParam" requestUrl="/api1/iot/open/GetProcessData"
									:size="9999" :placeholder="$t('distributedEnter.placeholderTextChoose')"
									inputKey="code" :column="data.columnRule.column" bindValue="locationName"
									@setClick="getRuleClick">
								</comboGrid>
							</view>
							<!-- 不可编辑 -->
							<view class="input-dialog-item-count" v-else>{{ data.popupInfo.processCode }}</view>
						</view>
						<view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title"
								style="width:100rpx">{{ $t('multilingual.productionLine') }}：</text>
							<view class="input-dialog-item-count" v-if="data.indexs > 0"
								style="width:100%;position: relative;">
								<!-- <uni-easyinput class="input-border" v-model="data.popupInfo.lineCode"
									:placeholder="$t('distributedEnter.damageQty')" /> -->
								<comboGrid ref="comboGridRef" v-model="data.popupInfo.lineCode"
									:requestParam="data.requestParam2" requestUrl="/api1/iot/open/GetProcessData"
									:size="9999" :placeholder="$t('distributedEnter.placeholderTextChoose')"
									inputKey="code" :column="data.columnRule2.column" bindValue="locationName"
									@setClick="getRuleClick2">
								</comboGrid>
							</view>
							<!-- 不可编辑 -->
							<view class="input-dialog-item-count" v-else>{{ data.popupInfo.lineCode }}</view>
						</view>
						<view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title" style="width:100rpx">{{ $t('mexico.position') }}：</text>
							<view class="input-dialog-item-count" v-if="data.indexs > 0"
								style="width:100%;position: relative;">
								<!-- <uni-easyinput class="input-border" v-model="data.popupInfo.locationCode"
									:placeholder="$t('distributedEnter.damageQty')" /> -->
								<comboGrid ref="comboGridRef" v-model="data.popupInfo.locationCode"
									:requestParam="data.requestParam3" requestUrl="/api1/iot/open/GetProcessData"
									:size="9999" :placeholder="$t('distributedEnter.placeholderTextChoose')"
									inputKey="code" :column="data.columnRule3.column" bindValue="locationName"
									@setClick="getRuleClick3">
								</comboGrid>
							</view>
							<!-- 不可编辑 -->
							<view class="input-dialog-item-count" v-else>{{ data.popupInfo.locationCode }}</view>
						</view>
						<!-- <view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title">{{ $t('Common.pointPosition') }}：</text>
							<view class="input-dialog-item-count" v-if="data.indexs > 0">
								<uni-easyinput class="input-border" v-model="data.popupInfo.code"
									:placeholder="$t('distributedEnter.damageQty')" />
							</view>
			
							<view class="input-dialog-item-count" v-else>{{ data.popupInfo.code }}</view>
						</view> -->
						<view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title">{{ $t('taskManagement.operationType') }}：</text>{{
								data.popupInfo.operation }}
						</view>
					<!-- 	<view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title">{{ $t('taskManagement.goodsType') }}：</text>{{
								data.popupInfo.wareType }}
						</view> -->
						<view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title">{{ $t('distributedEnter.qty') }}：</text>
							<!-- 可编辑 -->
							<view class="input-dialog-item-count" v-if="data.indexs > 0">
								<uni-easyinput v-model="data.popupInfo.qty" type="number"
									:placeholder="$t('distributedEnter.damageQty')" />
							</view>
							<!-- 不可编辑 -->
							<view class="input-dialog-item-count" v-else>{{ data.popupInfo.qty }}</view>
						</view>
						<view :class="data.indexs > 0 ? 'input-padding custom-card-itemOne' : 'custom-card-itemOne'">
							<text class="item-info-title">{{ $t('taskManagement.destinationsQty') }}：</text>
							<!-- 可编辑 -->
							<view class="input-dialog-item-count" v-if="data.indexs > 0">
								<uni-easyinput class="input-border" v-model="data.popupInfo.currentQty" type="number"
									:placeholder="$t('distributedEnter.damageQty')" />
							</view>
							<!-- 不可编辑 -->
							<view class="input-dialog-item-count" v-else>{{ data.popupInfo.currentQty }}</view>
						</view>
						<view class="input-dialog-footer" v-if="data.indexs > 0">
							<view class="input-dialog-button" @click="cancelFn">
								{{ $t('calendar.cancel') }}
							</view>
							<view class="input-dialog-button dialog-button-left" @click="confirmFn">
								{{ $t('calendar.confirm') }}
							</view>
						</view>
					</view>
				</uni-popup>
			</view>
		</template>
	</gui-page>
</template>

<script setup>
	import {
		navigate,
		navigateBack
	} from '@/utils/routerSkip.js';
	import {
		reactive,
		ref,
		onMounted,
		computed,
		watch,
		toRaw,
		toRef
	} from 'vue';
	import {
		getDataDictionaryFn,
		pitchOnFn,
		sortClass
	} from '@/utils/index.js'
	import {
		getTaskInfo,
		getTaskStepByTaskCode,
		modifyTaskLocation
	} from '@/api/api.js'
	import superweiCombox from '@/components/superweiCombox';
	import tableColor from '@/hooks/tableColor.js'
	import storageBin from '@/components/storageBin.vue'
	import comboGrid from "@/components/comboGrid";
	import {
		basPdaOperationLogFn
	} from '@/utils/index.js';
	import {
		OPERATION_SCAN,
		OPERATION_LOOK,
		OPERATION_COMMIT
	} from '@/constant/index.js'
	import {
		useStore
	} from "vuex";
	import {
		onBackPress
	} from '@dcloudio/uni-app';
	import pdaScan from '@/hooks/pdaScan.js'

	//国际化引入
	import {
		useI18n
	} from 'vue-i18n';
	const {
		t
	} = useI18n();

	let store = useStore()
	const {
		scan
	} = pdaScan()

	components: {
		storageBin,
		superweiCombox,
		comboGrid
	}
	let {
		tableData
	} = tableColor();
	const {
		cellStyle,
		cellHeaderStyle
	} = tableColor();
	const props = defineProps({
		id: String
	})
	let popup = ref(null)
	let inputDialog = ref(null)

	const data = reactive({
		inforDetails: {},
		column1: [
			{
				name: 'age',
				type: 'ailibtn',
				label: t('translationImage.operation'),
				scanValue: '',
				fixed: true,
				width: 80,
			},
			{
				type: 'index',
				label: t('translationImage.serialNumber'),
				width: 80,
			},
			{
				name: 'processCode',
				label: t('translationImage.process'),
				width: 110,
				emptyString: '--'
			}, {
				name: 'lineCode',
				label: t('multilingual.productionLine'),
				scanValue: '',
				width: 140,
			},
			{
				name: 'locationCode',
				label: t('mexico.position'),
				width: 140,
				emptyString: '--'
			}, {
				name: 'code',
				label: t('Common.pointPosition'),
				scanValue: '',
				width: 80,
			},
			{
				name: 'operation',
				label: t('taskManagement.operationType'),
				width: 150,
				emptyString: '--'
			}, {
				name: 'wareType',
				label: t('taskManagement.goodsType'),
				width: 160,
				emptyString: '--'
			},
			{
				name: 'qty',
				label: t('distributedEnter.qty'),
				width: 80,
				emptyString: '--'
			},
			{
				name: 'currentQty',
				label: t('taskManagement.destinationsQty'),
				width: 135,
				emptyString: '--'
			}
		],
		popupInfo: {},
		indexs: 0, //选择的第几行数据
		requestParam: {
			type: '1',
			parentCode: '',
			scanType: ''
		},
		requestParam2: {
			type: '2',
			parentCode: '',
			scanType: ''
		},
		requestParam3: {
			type: '3',
			parentCode: '',
			scanType: '',
			ProcessCode: ''
		},
		columnRule: {
			column: [{
				label: t('translationImage.process'),
				name: "text",
			}, {
				label: 'code',
				name: "code",
			}]
		},
		columnRule2: {
			column: [{
				label: t('newTranslation.productionLineCode'),
				name: "text",
			}, {
				label: t('newTranslation.productionLineName'),
				name: "code",
			}]
		},
		columnRule3: {
			column: [{
				label: t('Common.pointPositionCode'),
				name: "text",
			}, {
				label: t('Common.pointPositionName'),
				name: "code",
			}]
		},
	})

	onMounted(() => {
		taskInfo();
		getTableData()
	})

	data.barcodeList = computed(() => {
		// return store.state.transferredList
	})

	const taskInfo = () => {
		getTaskInfo({
			taskCode: props.id,
			beginTime: '',
			endTime: '',
			agvCode: "",
			robotTaskCode: '', // 任务类型
			taskStatus: data.selectId, // 任务状态
			taskType: '', // 任务类型，一般是搬运
			fromProcessCode: '', //取货地工序code
			fromLocationCode: '', //取货地位置code
			fromLineCode: '', //取货地线别code
			toProcessCode: '', //放货地工序code
			toLineCode: '', //放货地线别code
			toLocationCode: '', //放货地位置code
			materialCode: '', //物料号 多个之间用; 隔开
			cartonCode: '', //托盘号
			cartonType: '', //托盘类型 WoodCarton48  48 英寸木托盘 / WoodCarton60  60 英寸木托盘 
			priority: '', //任务优先级
			pageSize: 20,
			pageNo: 1
		}).then(res => {
			try {
				let inputParameter = JSON.stringify(parmes)
				let returnParameter = JSON.stringify(res)
				let operationPicture = 'AGV任务管理--任务详情'
				let callInterface = res.rquestUrl
				let opertionParmes = {
					inputParameter,
					returnParameter,
					operationPicture,
					callInterface,
					responseCode: res.code, //返回状态
					errorMessage: res.message, //错误信息
					isPass: res.code == 200 ? 'Y' : 'N', //是否成功 Y N
					operationType: OPERATION_LOOK,
					module: 'WMS',
					source: "PDA",
				}
				basPdaOperationLogFn(opertionParmes)
			} catch (error) {}
			if (res.code == 200) {
				data.inforDetails = res.result.items[0]
				
			} else {
				uni.showToast({
					title: res.message,
					icon: 'none'
				})
			}
		})
	}

	// 表格获取
	const getTableData = () => {
		getTaskStepByTaskCode({
			taskCode: props.id
		}).then(res => {
			try {
				let inputParameter = JSON.stringify(parmes)
				let returnParameter = JSON.stringify(res)
				let operationPicture = 'AGV任务管理--变更目的地'
				let callInterface = res.rquestUrl
				let opertionParmes = {
					inputParameter,
					returnParameter,
					operationPicture,
					callInterface,
					responseCode: res.code, //返回状态
					errorMessage: res.message, //错误信息
					isPass: res.code == 200 ? 'Y' : 'N', //是否成功 Y N
					operationType: OPERATION_LOOK,
					module: 'WMS',
					source: "PDA",
				}
				basPdaOperationLogFn(opertionParmes)
			} catch (error) {}
			if (res.code == 200) {
				tableData.list = res.result
			} else {
				uni.showToast({
					title: res.message,
					icon: 'none'
				})
			}
		})
	}
	// 表格相关事件
	const rowClick = () => {

	}
	const customBtnFn = (item, index) => {
		console.log(item, index)
		data.indexs = Number(index)
		data.popupInfo = item;
		data.requestParam2.parentCode=item.processCode
		data.requestParam3.parentCode = item.lineCode
		popup.value.open()
	}
	const closePopup = () => {
		popup.value.close()
	}
	const cancelFn = () => {
		popup.value.close()
	}
	// 工序选择
	const getRuleClick = (e) => {
		data.popupInfo.processCode = e.code
		data.requestParam2.parentCode = e.code
		data.popupInfo.processName = e.text
		data.popupInfo.lineCode=''
	}

	// 产线选择
	const getRuleClick2 = (e) => {
		data.popupInfo.locationCode=''
		data.popupInfo.lineCode = e.code
		data.requestParam3.parentCode = e.code
		data.requestParam3.ProcessCode = data.popupInfo.processCode
		data.popupInfo.lineName = e.text
	}
	// 位置选择
	const getRuleClick3 = (e) => {
		data.popupInfo.locationCode = e.code
		data.popupInfo.locationName = e.text
	}
	// 弹框确定
	const confirmFn = () => {
		tableData.list.forEach(item => {
			if (item.id == data.popupInfo.id) {
				item = data.popupInfo
			}
		})
		popup.value.close()
	}
	// 提交  变更目的地
	const changDestination = () => {
		
		
		if(data.popupInfo.code==undefined)
		{			
			uni.showToast({
				title: '请修改目的地',
				icon: 'none'
			})		
			return
		}
		    var step = {};

		    step.code = data.popupInfo.code;
			step.processCode = data.popupInfo.processCode;
			step.processName = data.popupInfo.processName;
			step.lineCode = data.popupInfo.lineCode;
			step.lineName = data.popupInfo.lineName;
			step.locationCode = data.popupInfo.locationCode;
			step.locationName = data.popupInfo.locationName;
			step.seq = data.popupInfo.seq;
			step.operation = data.popupInfo.operation;
			step.wareType = data.popupInfo.wareType;
			step.qty = data.popupInfo.qty;
			step.currentQty = data.popupInfo.currentQty;
       
		let parmes = {}
        parmes.taskCode=props.id
		parmes.taskstep = step;
		modifyTaskLocation(parmes).then(res => {
			try {
				let inputParameter = JSON.stringify(parmes)
				let returnParameter = JSON.stringify(res)
				let operationPicture = 'AGV任务管理--变更目的地'
				let callInterface = res.rquestUrl
				let opertionParmes = {
					inputParameter,
					returnParameter,
					operationPicture,
					callInterface,
					responseCode: res.code, //返回状态
					errorMessage: res.message, //错误信息
					isPass: res.code == 200 ? 'Y' : 'N', //是否成功 Y N
					operationType: OPERATION_COMMIT,
					module: 'WMS',
					source: "PDA",
				}
				basPdaOperationLogFn(opertionParmes)
			} catch (error) {}
			if (res.code == 200) {
				uni.showToast({
					title: '提交成功',
					icon: 'none'
				})
				// uni.navigateBack({
				// 	delta: 1
				// });
			} else {
				uni.showToast({
					title: res.message,
					icon: 'none'
				})
			}
		})
	}


	// 返回
	onBackPress((options) => {
		if (options.from == 'backbutton') {
			navBackCheck()
			return true;
		}
	})
	//导航栏左侧返回
	const clickLeftBack = () => {
		navBackCheck()
	}
	const navBackCheck = () => {
		if (!data.barcodeList.length) {
			uni.navigateBack({
				delta: 1
			});
			return true
		}
		uni.showModal({
			title: t('smashRemoval.warmPrompt'),
			content: t('materials.unsubmittedDataIn'),
			success: function(res) {
				if (res.confirm) {
					store.commit('clearTransferredList')
					uni.navigateBack({
						delta: 1
					});
				} else if (res.cancel) {
					console.log('用户点击取消');
				}
			}
		});
	}
</script>

<style scoped lang="scss">
	.input-padding {
		padding: 20rpx 0;
		border-bottom: 0.03125rem solid #F2F2F2 !important;
	}
</style>